<template>
  <div class="body">
    <header class="header">
      <div class="title">
        <!-- <router-link> -->
        <img @click="toback" src="../../assets/images/01_11.png" alt="" class="img_zuo" />
        <!-- </router-link> -->
        <div>宣传部署</div>
        <!-- <img v-show="jiahao" class="img_big" src="../../assets/images/01_05.png" @click="add" /> -->
      </div>
    </header>
    <div class="contant">
      <div class="listvr">
        <div @click="todetail(v.id)" class="xcbs_box" v-for="(v,index) of list" :keys="index">
          <div class="xcbs_child">
            <img class="img_persons" :src="v.gfg" />
            <div class="xcbs_suns">
              <div class="xcbs_tit">[{{v.type}}]&nbsp;{{v.title}}</div>
              <div class="xcbs_sun">
                <img class="img_people" src="../../assets/images/people.png" />
                <div>{{v.name}}</div>
              </div>
            </div>
          </div>
          <div class="time">{{v.time}}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  // import  Tabbar from '../../tabbar'
  export default {
    name: 'inspection',
    data() {
      return {
        userId: null, //用户id
        list: [],
        jiahao: true,
        taskSpecialId: '',
        theNewTaskAssignId: '',
        deployId: '',
        isPostOrGet: '',
        where: '',
        leibielist: [], //方式
        loading: false,//加载状态结束false
        finished: false,//全部加载完成true
        error: false,//出错状态
        refreshing: false,//是否下拉加载 是true
        cunt: 1,
        yinchang: false,
        scroll: 0,
        total: null,
      }
    },
    components: {
      // Tabbar
    },
    beforeRouteLeave(to, from, next) {
        //设置路由的 meta
        if(!(to.path=='/xcbs_detail')){
          localStorage.removeItem("list_scrollTop");
        }
        next();
    },
    //进入该页面时，用之前保存的滚动位置赋值
    beforeRouteEnter (to, from, next) {
        next(vm => {
          var list_scrollTop = localStorage.getItem("list_scrollTop")?JSON.parse(localStorage.getItem("list_scrollTop")):null;
          if(list_scrollTop||list_scrollTop===0){
            $('.contant').animate({scrollTop: list_scrollTop}, 0);
          }else{
            vm.userId = localStorage.getItem("userId") //获取访问id
            vm.taskSpecialId = localStorage.getItem("rwjb_taskSpecialId")
            vm.theNewTaskAssignId = localStorage.getItem("rwjb_theNewTaskAssignId")
            vm.isPostOrGet = JSON.parse(localStorage.getItem("rwjbDwType"))
            vm.deployId = localStorage.getItem("deploymentId")
            vm.jiaoban()
          }
          localStorage.removeItem("list_scrollTop");
        })
    },
    methods: {
      toback() {
        this.$router.back()
      },
      todetail(id) {
        console.log(id)
        var kfc = {
          id: id,
          lujing: "xcbs_rwjb"
        }
        sessionStorage.setItem("todetail", JSON.stringify(kfc))
        localStorage.setItem("list_scrollTop",$('.contant').scrollTop());
        this.$router.push("/xcbs_detail")
      },

      jiaoban() {
        this.axios.get(
          `${this.$global_msg.Url.host}/taskAssign/deploymentList?userId=${this.userId}&taskSpecialId=${this.taskSpecialId}&theNewTaskAssignId=${this.theNewTaskAssignId}&isPostOrGet=${this.isPostOrGet}&deployId=${this.deployId}`, {
          headers: {
            "Content-Type": "application/json"
          }
        }).then(res => {
          console.log(res)
          this.list = res.data.rows.list
          res.data.rows.list.forEach((v,index)=>{
            if(v.type=="风险研判"){
             this.list[index].gfg=require("../../assets/images/yanpan.png")
            }else if(v.type=="安排部署"){
              this.list[index].gfg=require("../../assets/images/bushu.png")
              }
            else if(v.type=="安全培训"){
              this.list[index].gfg=require("../../assets/images/peixun.png")
              }
            else if(v.type=="桌面推演"){
              this.list[index].gfg=require("../../assets/images/tuiyan.png")
              }
            else if(v.type=="实战演练"){
              this.list[index].gfg=require("../../assets/images/yanlian.png")
              }
            else if(v.type=="警示约谈"){
              this.list[index].gfg=require("../../assets/images/yuetan.png")
              }
            else if(v.type=="隐患协调"){
              this.list[index].gfg=require("../../assets/images/xietiao.png")
              }
            else if(v.type=="现场安全宣传"){
              this.list[index].gfg=require("../../assets/images/xianchang.png")
              }
            else if(v.type=="入户安全宣传"){
              this.list[index].gfg=require("../../assets/images/ruhu.png")
              }
             else if(v.type=="网络安全宣传"){
               this.list[index].gfg=require("../../assets/images/wangluo.png")
               }
              else{
                this.list[index].gfg=require("../../assets/images/baosong.png")
              }
          })
        }).catch(e => terminal._error(e));
      },
    },
    mounted() {
      var _this = this;
      document.body.style.backgroundColor = "#F7F7F9";
      document.addEventListener("scroll", this.scrollfunc, true)

      //物理返回
      // window.addEventListener("popstate", function(){
      //   _this.toback();
      // }, false);
    },
    created() {

    }
  }
</script>

<style scoped>
  .body{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
  }
  .posi {
    display: flex;
    flex-wrap: wrap;
    position: fixed;
    top: 1.8519rem;
    width: 100%;
    background: #fff;
    z-index: 10;
  }

  .styles {
    display: inline-block;
    /* border: 1px solid blue; */
    width: 19.6%;
    font-size: 0.25rem;
    margin-bottom: 0.2rem;
  }

  .hdgd {
    text-align: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }

  .hdgd div {
    display: inline-block;
  }

  .styles div {
    margin-top: 0.1rem;
  }

  .rvvee {
    width: 100%;
  }

  .stylebox {
    background: white;
    padding: 0.37037rem;
    box-sizing: border-box;
    /* border: 1px solid red; */
  }

  .img_log6 {
    width: 0.8rem;
    display: inline-block;
  }

  .img_people {
    width: 0.3rem;
    margin-right: 0.2rem;
    height: 0.3rem;
  }

  .xcbs_suns {
    width: 85%;
    /* border: 1px solid red; */
    margin-left: 0.3rem;
    margin-top: 0.15rem;
  }

  .xcbs_sun {
    display: flex;
    align-items: center;
    font-size: 0.296296rem;
    color: #999;
    margin-top: 0.092592rem;
  }

  .time {
    font-size: 0.35rem;
  }

  .xcbs_tit {
    font-size: 0.35rem;
    width: 100%;
    /* border: 1px solid red; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .img_persons {
    width: 0.731481rem;
    height: 0.722222rem;
  }

  .xcbs_child {
    /* border: 1px solid blue; */
    width: 85%;
    display: flex;
    align-items: center;
  }

  .listvr {
    margin-top: 0.2rem;
  }

  .xcbs_box {
    display: flex;
    justify-content: space-between;
    height: 1.388888rem;
    border-radius: 0.15rem;
    align-items: center;
    background-color: white;
    padding: 0 0.4rem;
  }

  .listvr_tit {
    border-radius: 0.15rem;
    padding: 0 0.4rem;
    height: 0.8rem;
    background-color: white;
    line-height: 0.8rem;
    border-bottom: 1px solid #DDDDDD;
  }

  .contant {
    flex: 1;
    width: 100%;
    overflow-y: scroll;
  }

  .header {
    height: 1.8519rem;
    background: #007aff;
    padding-top: 0.8333rem;
    box-sizing: border-box;
    width: 100%;
    z-index: 20;
    font-size: 0.388888rem;
  }

  .title {
    padding: 0 0.3704rem;
    display: flex;
    align-items: center;
    color: #fff;
  }

  .title>div {
    width: 100%;
    font-size: 0.4444rem;
    text-align: center;
  }

  .img_zuo {
    width: 0.2593rem;
    height: 0.463rem;
  }

  .img_big {
    width: 0.629629rem;
  }
</style>
